<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="styles/style.css" rel="stylesheet" type="text/css" />
<title>登录页</title>
<script type="text/javascript" src="script/jquery.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		$("form :input.inputstyle").each(function(){
			 var $required = $('<strong class="high">*</strong>');
			$(this).parent().append($required);
		});
		$("form :input").blur(function(){
			var $parent = $(this).parent();
			$parent.find(".formtips").remove();
			//验证用户名
			if($(this).is("#name")){
				if(this.value == "" ||  this.value.length <6){
					var errorMsg = '请输入至少六个字符';
					$parent.append('<span class = "formtips onError">'+errorMsg+'</span>');
				}else{
					var okMsg = '输入正确';
					$parent.append('<span class = "formtips onRight">'+okMsg+'</span>');
				}
			}
			//验证密码
			if($(this).is("#password")){
				if(this.value == "" || (this.value != "" && !/\w{6,15}/.test(this.value))){
					var errorMsg = '密码由6-15个字符组成';
					$parent.append('<span class = "formtips onError">'+errorMsg+'</span>');
				}else{
					var okMsg = '输入正确';
					$parent.append('<span class = "formtips onRight">'+okMsg+'</span>');
				}
			}
		}).keyup(function(){
			$(this).triggerHandler("blur");
		}).focus(function(){
			$(this).triggerHandler("blur");
		});
		$("#login_btn").click(function(){
			$("form :input.inputstyle").trigger("blur");
			var numError = $("form .onError").length;
			if(numError){
				return false;
			}
		});
		$("#btn_zc").click(function(){
			window.location = "index!reg";
		});
	});
</script>
</head>

<body>
	<div class="container">
		<%@ include file="template/msg.file"  %>
        <div class="center">
        	<div class="box">
            	<div class="size1">
                	<h3 class="ico1">猫扑会员登录</h3>
                	<form action="user.jspx" method="post">
                    <table>
                    	<tbody>
                        	<tr id="err_tr">
                            <th>&nbsp;</th>
                            <c:if test="${empty msg }">
                            	<td id="err_text" style="color:red">${ msg }</td>
                            	<c:remove var="msg" scope="session"/>
                            	</c:if>
                            </tr>
                            <tr>
                            	<th>用户名</th>
                                <td>
                                	<input class="inputstyle" id="name" name="name" type="text"  />
                                </td>
                               
                            </tr>
                            <tr> <td colspan ="2"><span id = "namemsg"></span></td></tr>
                            <tr class="mmpart">
                            	<th>密码：</th>
                                <td>
                                	<input type="password" id="password" class="inputstyle" name="password" />  
                                </td>                            
                            </tr>
                             <tr> <td colspan ="2"><span id = "passwordmsg"></span></td></tr>
                            <tr>
                            	<th>&nbsp;</th>
                                <td>
                                <div class="zddl">
                                	<input type="checkbox" class="checkboxstyle" id="autologin" />
                                    <span>自动登录</span>
                                    </div>
                                </td>
                                </tr>
                                <tr>
                                	<th>&nbsp;</th>
                                    <td class="btnarea">
                                    	<input id="login_btn" class="btnstyle" type="submit" name="login" value="登录" />
                                    </td>
                                </tr>
                        </tbody>
                    </table>
                    </form>
                    <ul class="dot">
                    	<li class="icosj">
                        	还没有猫扑通行证？
                    </li>
						<li>
                        	<input type="button" id="btn_zc" value="立即注册" class="btnstyle" />
                        </li>

                    </ul>
                </div>
                <div class="size2">
                	<img src="images/img_ldbyy.jpg" />
                </div>
            </div>
              </div>
        <%@include file="template/footer.jsp"%>
    </div>
</body>
</html>

